<template>
    <!--style="width: calc(100% - 100px); height: calc(100% - 55px);"-->
    <!-- 弹出框 -->
    <a-modal
      :title="title"
      :visible="visible"
      width="100%"
      destroyOnClose
      :class="'jeecg-online-modal'"
      :bodyStyle="bodyStyle"
      style="top: 0px"
      :footer="null"
      @cancel="handleModalCancel"
    >
      <a-tabs defaultActiveKey="1" tabPosition="left">
         <a-tab-pane key="1">
          <span slot="tab">
            <a-icon type="file-text" />
            <span>单据信息</span>
          </span>
          <div class="component_div" :style="formBodyStyle">
            <template v-if="isComp">
              <dynamic-link :path="path" :formData="formData" @ok="valForm" @initFlowParam="initFlowParam"></dynamic-link>
            </template>
            <template v-else>
              <iframe :src="iframeUrl" frameborder="0" width="100%" :height="height" scrolling="auto"></iframe>
            </template>
          </div>
        </a-tab-pane>
        <a-tab-pane key="2">
          <span slot="tab">
            <a-icon type="sliders" />
            <span>流程图</span>
          </span>
          <process-module :formData="formData" :style="formBodyStyle"></process-module>
        </a-tab-pane>
      </a-tabs>
    </a-modal>
  </template>
  
  <script>
    import Vue from 'vue'
    import TaskModule from './form/TaskModule'
    import ProcessModule from './form/ProcessModule'
    import {httpAction} from '@/api/manage'
    import DynamicLink from './form/DynamicLink.vue'
    import {isURL} from '@/utils/validate'
    import {ACCESS_TOKEN} from '@/store/mutation-types'
  
    export default {
    name: 'TaskSignModal',
    components: {
      DynamicLink,
      TaskModule,
      ProcessModule,
    },
    props: ['path', 'formData'],
    computed: {
      isComp: function () {
        var TOKEN = Vue.ls.get(ACCESS_TOKEN)
        var DOMAIN_URL = window._CONFIG['domianURL']
        var TASKID = this.formData.taskDefKey
        var URL = (this.path || '').replace(/{{([^}}]+)?}}/g, (s1, s2) => eval(s2)) // URL支持{{ window.xxx }}占位符变量
        console.log('isComp组件名称：', URL)
        if (isURL(URL)) {
          this.iframeUrl = URL
          return false
        }
        return true
      },
    },
    data() {
      return {
        isValForm: '1',
        loading: false,
        flowParam: {},
        title: '流程',
        visible: false,
        bodyStyle: {
          padding: '0',
          height: window.innerHeight - 80 + 'px',
          'overflow-y': 'auto',
        },
        formBodyStyle: {
          padding: "0",
          height:(window.innerHeight-120)+"px",
          "overflow-y":"auto"
        },
        height: window.innerHeight - 120 + 'px',
        iframeUrl: '',
      }
    },
    created() {},
    methods: {
      initFlowParam(param){
        this.flowParam = param
        console.log("流程参数:",param)
      },
      valForm() {
         this.isValForm = '0'
      },
      // 关闭模态框
      handleModalCancel() {
        this.visible = false
      },
      deal(data) {
        this.visible = true
      },
      completeProcess(e) {
        const that = this
        const val = e
        if (this.$refs.public && this.$refs.public.$children &&
          this.$refs.public.$children[0].synSubmitForm && this.formData.extendUrlParams.edit == 1) {
          this.$refs.public.$children[0]
            .synSubmitForm()
            .then(() => {
              that.httpModel(val)
            })
            .catch(() => {
              console.log('流程异常，请联系管理员')
            })
        } else {
          that.httpModel(val)
        }
      },
      httpModel(val) {
        // 添加流程参数
        this.$set(val.model,'dataId', this.flowParam.dataId)
        this.$set(val.model,'beanName', this.flowParam.beanName)
        this.$set(val.model,'flowCode', this.flowParam.flowCode)
        this.$set(val.model,'formUrl', this.flowParam.formUrl)
        this.$set(val.model,'formUrlMobile', this.flowParam.formUrlMobile)
        console.log("任务处理参数:",val)
        const that = this
        that.$refs.task.showLoading()
        //先去掉上一个组件里的方法，成功回调后再调请求
        if (!val.url) {
          that.$refs.task.hideLoading()
          this.visible = false
          this.$emit('ok')
        } else {
          httpAction(val.url, val.model, val.model.method).then((res) => {
            if (res.success) {
              that.$message.success(res.message)
              that.$refs.task.hideLoading()
              this.visible = false
              this.$emit('ok')
            } else {
              that.$message.warning('流程异常，请联系管理员')
            }
          })
        }
      },
    },
    mounted() {
      console.log(this.path, '21')
    },
  }
  </script>
  
  <style lang="less" scoped>
  .ant-tabs-left-content {
    padding-top: 10px !important;
  }
  
  .component_div {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  
  // 兼容1.6.2版本的antdv全屏
  /deep/ .ant-modal {
    top: 0;
    padding: 0;
  }
  </style>